<!--
 * @Description: 
 * @Author: YaoXiaotTian
 * @Date: 2021-05-27 22:30:53
 * @LastEditors: YaoXiaoTian
 * @LastEditTime: 2021-05-28 00:07:22
-->
<template>
  <div class="registered">
    <div class="vessle">
      <div class="title">注册</div>
      <div class="input_vessle">
        <el-input placeholder="账号" v-model="account">
          <i slot="prefix" class="el-input__icon el-icon-mobile-phone"></i>
        </el-input>
      </div>
      <!-- <div class="input_vessle verification">
        <el-input placeholder="验证码">
          <i slot="prefix" class="el-input__icon el-icon-user"></i>
        </el-input>
        <span></span>
        <el-button class="code_btn">获取验证码</el-button>
      </div> -->
      <div class="input_vessle">
        <el-input placeholder="密码" v-model="password" show-password>
          <i slot="prefix" class="el-input__icon el-icon-lock"></i>
        </el-input>
      </div>
      <div class="input_vessle last-input">
        <el-input placeholder="确认密码" v-model="anotherPassword" show-password>
          <i slot="prefix" class="el-input__icon el-icon-lock"></i>
        </el-input>
      </div>
      <el-button plain class="registered_btn" @click="registered">注 册</el-button>
      <div class="login" @click="loginFun">登录</div>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      account: "",
      password: "",
      anotherPassword: ""
    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {},
  methods: {
    registered() {
      if (!this.account) {
        this.$message.error("账号不能为空");
        return
      }
      if (!this.password) {
        this.$message.error("密码不能为空");
        return
      }
      if (!this.anotherPassword) {
        this.$message.error("请再次输入密码");
        return
      }
      if (this.password!=this.anotherPassword) {
        this.$message.error("两次密码输入不一致");
        return
      }
      this.$http
        .fetch(this.$apiPath.register, {
          method: "post",
          data: {
            passWord: this.password,
            userName: this.account,
          },
        }).then(res => {
          if (res.code == 200) {
            this.$message.success("注册成功");
            this.loginFun();
            return
          }
          this.$message.error(res.msg);
        })
    },
    loginFun() {
      this.$router.push({
          path: "/login"
        });
    }
  },
};
</script>
<style lang="less" scoped>
@import "./index.less";
</style>
